<template>
  <div class="search">
    <f-drawer :visible="drawerVisible" :title="modalTitle" ref="topicDrawer" :width="900" @submit="handleSubmit" @visibleChange="visibleChange">

      <a-tabs @tabClick="handleTabClick" :defaultActiveKey="current" v-model="current">
        <a-tab-pane tab="基本信息" key="form1">
          <company-form ref="form1" v-if="drawerVisible"></company-form>
        </a-tab-pane>
        <a-tab-pane tab="法人信息" key="form2" v-if="isEdit">
          <company-faren ref="form2" v-if="drawerVisible"></company-faren>
        </a-tab-pane>
        <a-tab-pane tab="企业审核" key="form3" v-if="isEdit">
          <company-audit ref="form3" v-if="drawerVisible"></company-audit>
        </a-tab-pane>
        <a-tab-pane tab="开户银行" key="form4" v-if="isEdit">
          <company-bank ref="form4" v-if="drawerVisible"></company-bank>
        </a-tab-pane>
      </a-tabs>


    </f-drawer>
  </div>
</template>
<script>

  import CompanyForm from './company_form'
  import CompanyAudit from './company_audit'
  import CompanyFaren from './company_faren'
  import CompanyBank from './company_bank'

  export default {
    name: 'companyDrawer',
    props: {},
    data() {
      return {
        saving: false,
        isEdit: false,
        drawerVisible: false,
        title: '',
        current: 'form1',
        formData: {},
        forms: [
          'form1',
          'form2',
          'form3'
        ]
      }
    },
    methods: {
      handleShow(data) {
        if (data && data.companyId) {
          this.isEdit = true
          this.formData = data
        } else {
          this.formData = {}
        }
        this.$refs.topicDrawer.show()
        this.handleTabClick('form1')
      },
      visibleChange(drawerVisible) {
        this.drawerVisible = drawerVisible
      },
      handleSubmit(callback) {
        this.$refs[this.current].handleSubmit(callback)
      },
      handleTabClick(name) {
        this.current = name
        if (this.current === this.forms[0]) {
          this.title = this.isEdit ? '编辑企业' : '添加企业'
        }
        this.$nextTick(() => {
          this.$refs[this.current].setData(this.formData)
        })
      }
    },
    computed: {
      modalTitle: function() {
        return this.title
      }
    },
    created() {

    },
    components: { CompanyBank, CompanyFaren, CompanyAudit, CompanyForm }
  }
</script>

<style scoped lang="less" rel="stylesheet/less">

</style>
